MEUI: Modern embedded UI 现代化嵌入式用户界面 |
您所在的位置：网站首页 › QuickJS 嵌入式 › MEUI: Modern embedded UI 现代化嵌入式用户界面 |
MEUI: Modern embedded UI 现代化嵌入式用户界面
|
MEUI is a modern ui library for embedded platform based on quickjs and React.js
Nodejs 16.x MinGW-w64 x86_64-posix-seh-rt SDL2-devel-mingw Add MinGW into Environment Variables Copy the SDL2 files to MinGW [path to SDL2]\x86_64-w64-mingw32 => [path to MinGW]\x86_64-w64-mingw32 Ubuntu/WSLg Install Node.js cd ~ curl -sL https://deb.nodesource.com/setup_16.x | sudo bash - sudo apt -y install nodejs node -v Install GCC & Make sudo apt install gcc make Mac OS Install NVM Install Node.js nvm install node node -v Build & Run MEUI corepack enable xmake f --backend=sdl2-core # Only for windows/macos pnpm add -g pnpm # install the latest pnpm pnpm install pnpm build:all pnpm run:examplesRun other examples pnpm build:examples src/2048/index.tsx pnpm run:examples API References CSS Style export interface MeuiStyle { borderRadius?: [number, number, number, number] | number borderColor?: string backgroundColor?: Property.BackgroundColor fontColor?: Property.Color text?: string fontSize?: number fontFamily?: string textAlign?: | "center-left" | "center-right" | "center" | "top-left" | "top-right" | "top-center" | "bottom-left" | "bottom-right" | "bottom-center" backgroundImage?: string contentImage?: string transform?: string transformOrigin?: | [number, number] | ["left" | "center" | "right", "top" | "center" | "bottom"] flexWrap?: "nowrap" | "wrap" | "wrap-reverse" flexDirection?: "row" | "column" | "row-reverse" | "column-reverse" alignItems?: "stretch" | "flex-start" | "center" | "flex-end" | "baseline" alignSelf?: | "auto" | "stretch" | "flex-start" | "center" | "flex-end" | "baseline" alignContent?: | "stretch" | "flex-start" | "center" | "flex-end" | "space-between" | "space-around" justifyContent?: | "flex-start" | "center" | "flex-end" | "space-between" | "space-around" margin?: [number, number, number, number] | number border?: [number, number, number, number] | number padding?: [number, number, number, number] | number overflow?: "visible" | "hidden" | "scroll" | "auto" flexBasis?: number flexGrow?: number flexShrink?: number width?: Length height?: Length minWidth?: Length minHeight?: Length maxWidth?: Length maxHeight?: Length marginLeft?: Length marginTop?: Length marginBottom?: Length marginRight?: Length marginStart?: Length marginEnd?: Length paddingLeft?: Length paddingTop?: Length paddingBottom?: Length paddingRight?: Length paddingStart?: Length paddingEnd?: Length borderLeft?: number borderTop?: number borderBottom?: number borderRight?: number borderStart?: number borderEnd?: number borderTopLeftRadius?: number borderTopRightRadius?: number borderBottomRightRadius?: number borderBottomLeftRadius?: number left?: Length right?: Length top?: Length bottom?: Length zIndex?: number FOCUS?: MeuiStyle ACTIVE?: MeuiStyle HOVER?: MeuiStyle SELECT?: MeuiStyle DISABLE?: MeuiStyle CHECK?: MeuiStyle } Canvas APIarc arcTo beiginPath bezierCurveTo createRadialGradient createLinearGradient clearRect clip closePath ellipse fill fillRect fillText font getImageData getTransform lineCap lineDashOffset lineJoin lineWidth measureText Path2D putImageData quadraticCurveTo resetTransform rotate save scale setLineDash setTransform strokeRect strokeText textAlign textBaseline transform translate Discussion GroupTencent QQ Group: 765228998 ReferencesQuickJS Javascript Engine. Available at: https://bellard.org/quickjs/ PlutoVG is a standalone 2D vector graphics library in C. Available at: https://github.com/sammycage/plutovg React: A JavaScript library for building user interfaces. Available at: https://reactjs.org/ react-spring: A spring-physics first animation library. Available at: https://react-spring.io/ FlexLayout is an C implementation of Flexible Box layout. Available at: https://github.com/Sleen/FlexLayout single-file public domain (or MIT licensed) libraries for C/C++. Available at: https://github.com/nothings/stb Templated type-safe hashmap implementation in C. Available at: https://github.com/DavidLeeds/hashmap libpqueue is a generic priority queue (heap) implementation. Available at: https://github.com/vy/libpqueue |
【本文地址】